<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/page/common/taglib.jsp" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="zh-CN">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
    <title>商品首页</title>
	<meta name="description" content="" />
	<meta name="keywords" content="" />
	
    <link href="/css/main/font-awesome.min.css" rel="stylesheet" type="text/css" >
    <link href="/css/bootstrap.min.css" rel="stylesheet" type="text/css">
    <link href="/css/main/datepicker.css" rel="stylesheet" type="text/css">
    <link href="/css/main/style.css" rel="stylesheet">

  </head>
  <body>
	
	<jsp:include page="/WEB-INF/page/common/Head.jsp"/>
	
	<div class="box index">
       <!--sider-->
      <div class="sider pull-left">
         <h2>傲佑商城</h2>
         <ul>
           <c:forEach var="item" items="${productCategory}">
               <li class="">${item.name}
                <div class="sider_nav">
                   <c:forEach var="citem" items="${item.childrenCategory}">
                      <a href="/product/search?id=${citem.id}">${citem.name}</a>
                   </c:forEach>
                </div>
            </li>
           </c:forEach>            
        </ul>
         <dl>
            <dt class="pull-left">
              <p>建立联系</p>
              <p>新品速递和技术速递</p>
            </dt>
            <dd class="pull-left">
               <a href=""><img src="/images/main//subscribe_rev.png">
               <p>订阅</p></a>
            </dd>
            <div class="clearfix"></div>
         </dl>
      </div>
<!--/sider-->

 <!--content-->
      <div class="content pull-left">
         <h3>全球选择极为广泛的电子元件库</h3>
         <h4 class="text-right">能够立即发货！™</h4>
         <!--search-->
         <div class="search">
             <select class="pull-left">
               <option>所有的产品</option>
             </select>
             <input class="pull-left text_box" type="text" name="" placeholder="零件编号/关键词">
             <a class="pull-left a_btn" href="/product/list"><i class="fa fa-search"></i></a>
             <label><input type="checkbox" name="">现货</label>
             <div class="clearfix"></div>

         </div>
         <!--/search-->
         <div class="text-center tip"><a href="">不认识得捷电子？</a><a href="">订购说明</a><a href="">如何注册</a></div>
         <div class="banner"><a href=""><img src="/images/main//new-products-added-daily.jpg"></a></div>
         <!--banner_one-->
         <div class="banner_one">
         	<div class="banner_one_box">
	             <ul>
	                 <c:forEach var="pitem" items="${productLists}"> 
		               <li class="pull-left"><a href="/product/productDetail?pid=${pitem.productid}">
		                   <div class="img"><img src="${pitem.productinfo.imageUrl1}"></div>
		                   <p>${pitem.productinfo.productName}</p>
		                   <p class="red">提前加入购物车</p></a>
		               </li>
		            </c:forEach>   

	               <div class="clearfix"></div>
	             </ul>
             </div>
             <div class="pre fx"><i class="fa fa-chevron-left"></i></div>
             <div class="next fx"><i class="fa fa-chevron-right"></i></div>
             
         </div>
         
         <!--/banner_one-->
         <!--banner_two-->
         
         <div class="banner_two">
         	<div class="banner_two_box">
	             <div class="detail">
	             	<div class="detail_in">
		               
		              <c:forEach var="bitem" items="${brandlist}">
		                  <dl>
			                  <dt class="pull-left">
			                     <img src="${bitem.logo}">
			                  </dt>
			                  <dd class="pull-left">
			                     <h4>${bitem.brandName}</h4>
			                     <p>${bitem.description}</p>
			                     <a class="pull-right" href="">了解详情</a>
			                     <div class="clearfix"></div>
			                  </dd>
			                  <div class="clearfix"></div>
		               </dl>
		              
		              </c:forEach>  
		               
	               </div>
	             </div>
	             <ul class="name">
	                     <li class="pull-left"><img src="/images/main/harwin_color.jpg"></li>
	                     <li class="pull-left"><img src="/images/main/harwin_color.jpg"></li>
	                     <li class="pull-left"><img src="/images/main/harwin_color.jpg"></li>
	                     <li class="pull-left"><img src="/images/main/harwin_color.jpg"></li>
	                     <li class="pull-left"><img src="/images/main//harwin_color.jpg"></li>
	                     <li class="pull-left"><img src="/images/main//harwin_color.jpg"></li>
	                     <div class="clearfix"></div>
	             </ul>
             </div>
             <div class="pre fx"><i class="fa fa-caret-left"></i></div>
	         <div class="next fx"><i class="fa fa-caret-right"></i></div>
         </div>
         <!--/banner_two-->
      </div>
      
      <!--content-->
      <div class="clearfix"></div>
   </div>
   
  
<!-- 尾部 -->
<jsp:include page="/WEB-INF/page/common/Foot.jsp"/>

</body>


<script type="text/javascript" src="/js/main/jquery-1.11.2.js"></script>
<script type="text/javascript" src="/js/main/bootstrap.min.js"></script>
<script type="text/javascript" src="/js/main/app.js"></script>

</html>